<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/mall-common :: common_head(~{::title},~{::link},~{::script})">
    <title>网上图书商城</title>
    <link rel="stylesheet" href="/styles/mall/my-cart.css">
    <script src="/javascript/mall/my-cart.js" type="text/javascript"></script>
</head>
<body>
<div th:replace="common/mall-common::mall-header"></div>
<div class="mall-body">
    <div class="no-data" th:if="${cartItemList.size() == 0}">
        购物车暂无商品， 快去添加图书进来吧~
    </div>
    <form action="/order-confirm" th:if="${cartItemList.size() > 0}">
        <input type="hidden" name="fromType" value="cart">
        <div class="alert alert-success" role="alert" th:if="${isAddToCart}">
            成功将图书添加到购物车！
        </div>
        <div class="alert alert-danger" role="alert" th:if="${isRemoveFromCart}">
            购物车图书已成功删除！
        </div>
        <div class="alert alert-danger" role="alert" th:if="${ERR_MSG} != null">
            [[${ERR_MSG}]]
        </div>
        <div class="cart-item-list">
            <div class="cart-item" th:each="item:${cartItemList}">
                <input type="checkbox" name="cartItems" th:value="${item.id}" class="cart-item-checkbox"/>
                <img class="sku-img" th:src="${item.booksSkuDTO.getBooksSkuImgList().get(0).getImage()}"/>
                <div class="cart-info">
                    <div class="goods-name" th:text="${item.books.name}"></div>

                    <div class="goods-place" th:text="'作者：' + ${item.books.author}"></div>
                    <div class="goods-place" th:text="'出版社：' +${item.books.belongpublish.name}"></div>
                    <div class="sku-price"
                         th:text="${item.booksSkuDTO.currentPrice + ' x ' + item.count + ' = ' + item.booksSkuDTO.currentPrice * item.count} + '元'"></div>
                </div>
                <div class="actions-bar">
                    <div class="count-control">
                        <a type="button" class="btn btn-primary btn-sm">-</a>
                        <div class="count" th:text="${item.count}"></div>
                        <a type="button" class="btn btn-primary btn-sm">+</a>
                    </div>
                    <a type="button" class="btn btn-outline-danger cart-item-remove-btn btn-sm"
                       th:href="'/my-cart?removeId=' + ${item.id}">删除</a>
                </div>
            </div>
        </div>
        <div class="actions-area">
            <button type="submit" class="btn btn-success buy-btn">立即结账</button>
        </div>
    </form>
</div>
<div th:replace="common/mall-common::mall-footer"></div>
</body>
</html>